<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>jQuery_event</title>
		<style type = "text/css"></style>
		<script type = "text/javascript" src = "jquery-3.4.1.js"></script>
	</head>
	<body>
		<!-- ul>li{$}*6 -->
		 <ul>
		 	<li>1</li>
		 	<li>2</li>
		 	<li>3</li>
		 	<li>4</li>
		 	<li>5</li>
		 	<li>6</li>
		 </ul>
		<script>
			/* 
			 jQuery_event
			 
			 */
			//事件绑定，-->.on()支持链式操作
			$("li").on("mouseover",function(){//this表示当前事件流
				$(this).css("background","red");
			}).on("mouseout",function(){
				$(this).css("background","blue");
			}) 
			
			//事件解绑-->.off()
			//-->参数1: event Type 参数2:  callback name(回调函数名称)
			$("li:eq(3)").off("mouseover");//当回调函数为匿名函数的时候，可以不传这个参数
			
			$("<li>newLi</li>").appendTo("ul");
			
			//事件代理
			
		</script>
	</body>
</html>
